<template>
	<div class="box"></div>
</template>
<script>
export default {
	data() {
		return {
		}
	},
	methods: {
		add(value, index) {
			return new Promise(resolve => {
				setTimeout(function () {
					console.log(value);
					resolve(value);
				}, 1e3 * index);
			})
		}
	},
	async mounted() {
		await this.add(2);
		console.log(`第一次`);
		await this.add(3);
		console.log(`第二次`);
		await this.add(1);
		console.log(`第三次`);

		let arr = [1, 2, 5, 6, 7, 1, 2, 3];
		arr.forEach(async (res, index) => {
			await this.add(res, index);
		});
	}
}
</script>
<style lang="scss" scoped>
.box {
	width: 100px;
	height: 100px;
	border: 1px solid #000;
}
</style>